<template>
	<view class="big">
		<No v-if="logintype==false"></No>
		<view class="main" v-if="logintype" style="z-index: 88888;">
			<view v-if="flag">
				<view v-for="(item,index) in list" :key="index" @tap="removeitem(item)" style="z-index: 99999;"
					class="box">
					<image :src="item.img1">
						<text>{{item.proname}}</text>
				</view>
			</view>
			<Null v-if="flag1"></Null>
		</view>
	</view>
</template>

<script>
	import No from './components/noLogin.vue'
	import Null from './components/null.vue'
	import {
		remove
	} from '../../api/api.js'
	export default {
		data() {
			return {
				logintype: '',
				list: [],
				flag:true,
				flag1:false
			}
		},
		methods: {
			cartList() {
				uni.request({
					url: 'http://121.89.205.189:3000/api/cart/list',
					method: 'POST',
					header: {
						'Content-Type': 'application/json',
						token: `${uni.getStorageSync('token')} `
					},
					// data:{
					// 	userid:uni.getStorageSync('userid')
					// },
					success: (res) => {
						if(res.data.code == "10020"){
							this.flag = false
							this.flag1 = true
						}else{
							this.flag = true
							this.flag1 = false
						}
						this.list = res.data
					}
				});
			},
			removeitem(item) {
				console.log('41111111', item.cartid)
				uni.showModal({
					title: '提示',
					// 提示文字
					content: '确认删除该条信息吗？',
					// 取消按钮的文字自定义
					cancelText: "取消",
					// 确认按钮的文字自定义
					confirmText: "删除",
					//删除字体的颜色
					confirmColor: 'red',
					//取消字体的颜色
					cancelColor: '#000000',
					success: function(res) {
						if (res.confirm) {
							remove({
								cartid: item.cartid
							}).then(res => {
								console.log(res)
							})
							// 执行确认后的操作
						} else {
							// 执行取消后的操作
						}
					}
				})
			}
		},
		components: {
			No,
			Null
		},
		mounted() {
			this.cartList()
			this.logintype = uni.getStorageSync('userName');
		}
	}
</script>

<style lang="scss">
	.big {
		width: 100vw;
		height: 100vh;

		.main {
			width: 100vw;
			height: 100vh;

			.box {

				width: 95vw;
				margin: 0 auto;
				height: 20vh;
				display: flex;
				justify-content: space-between;
				align-items: center;

				image {
					width: 200rpx;
					height: 200rpx;
				}
			}
		}
	}
</style>